<template>
    <div class="funMenu" v-show="!BeginTeaching">
        <ul>
            <li class="XB">
                <a href="javascript:;" @click="XB" :class="{ 'router-link-active': routerAc == 'XB' }">
                    <i class="icon"></i>
                    <span>选班</span>
                </a>
            </li>
            <li class="XK">
                <a href="javascript:;" @click="XK" :class="{ 'router-link-active': routerAc == 'XK' }">
                    <i class="icon"></i>
                    <span>选课</span>
                </a>
            </li>
            <li class="DM">
                <a href="javascript:;" @click="DM" :class="{ 'router-link-active': routerAc == 'DM' }">
                    <i class="icon"></i>
                    <span>点名</span>
                </a>
            </li>
            <li class="FZ">
                <a href="javascript:;" @click="FZ" :class="{ 'router-link-active': routerAc == 'FZ' }">
                    <i class="icon"></i>
                    <span>分组</span>
                </a>
            </li>
            <li class="SK" @click="SK">
                <a>
                    <i class="icon"></i>
                    <span>上课</span>
                </a>
            </li>
            <li class="TC" @click="LogOut">
                <a>
                    <i class="icon"></i>
                    <span>退出</span>
                </a>
            </li>
        </ul>
        <bigBtn :sureClick="sureClick" :notClick="notClick" :showBigBtn="showBigBtn" :title="title" :notBtnName="notBtn"
                :sureBtnName="sureBtn"
                v-show="showBigBtn"></bigBtn>
    </div>
</template>
<script type="text/ecmascript-6">
    import {mapGetters, mapActions} from 'vuex'

    import store from '../store/'

    import axios from 'axios'

    export default {
        name: "funMenu",
        props: [],
        computed: mapGetters([
            'BeginTeaching',
            'infoStuPos',
            'ReTeachRecord'
        ]),
        data () {
            return {
                routerAc: 'XB',
                title: "确定要上课吗？",
                showBigBtn: false,
                loader: new SVGLoader(document.getElementById('loader'), {speedIn: 400, easingIn: mina.easeinout}),
                notBtn: "取消",
                sureBtn: "确定"
            }
        },
        mounted(){

        },
        methods: {
            notClick(){
                this.showBigBtn = false
            },
            sureClick(){
                var _this = this
                //                    _this.loader.show()

//                if (store.state.mutations.infoStudent.length != 0) {
//
//                    _this.loader.show()
//
//                    store.state.mutations.BeginTeaching = true
//                    setTimeout(function () {
//                        _this.routerAc = 'XK'
//                        _this.$router.push('/home/XK')
//                        _this.loader.hide()
//                        $('.contentTop').css({'height': '10px'})
//                    }, 2000)
//
//                } else {//如果上课时未进入点名界面获取学生信息 则在上课时获取并保存学生信息

                this.$http.get(('api/userinfo/students?id=' + store.state.mutations.enterClassID + '&sk=' + store.state.mutations.getToken)).then(function (res) {
                    //保存班级所有学生信息
                    store.state.mutations.infoStudent = res.data.data

                    //把班级所有学生ID存入UserCode
                    for (var i = 0; i < store.state.mutations.infoStudent.length; i++) {
                        UserCode.push(store.state.mutations.infoStudent[i].UserCode)
                    }

                })

                //检测是否正常下课
                _this.$http.get(('api/ReTeachRecord/getReTeachRecord?ClassID=' + store.state.mutations.enterClassID + '&sk=' + store.state.mutations.getToken)).then(function (res) {
                    console.log(res.data)

                    if (res.data.hasOwnProperty("data")) {
                        _this.showBigBtn = false;
                        console.log('没有正常结束 选择继续还是重新开始')
                        setTimeout(function () {
                            _this.showBigBtn = true;
                            _this.title = '您的上一堂课未正常结束，请选择操作的类型？'
                            _this.notBtn = '继续上课'
                            _this.sureBtn = '另外开始'
                            store.state.mutations.ReTeachRecord = res.data.data

                            _this.sureClick = function () {//重新定义确定按钮为另外开始上课
                                axios({
                                    method: "POST",
                                    url: 'api/ReTeachRecord/StartOtherClass' + '?sk=' + store.state.mutations.getToken,
                                    data: {
                                        TeacherID: store.state.mutations.USERINFO.ID,
                                        LessionID: LessionID,
                                        ClassID: store.state.mutations.enterClassID,
                                        ID: res.data.data.ID
                                    }
                                }).then(function (res) {
                                    console.log(res.data)
                                    window.ExamTime = res.data.data
                                    _this.loader.show()
                                    setTimeout(function () {
                                        store.state.mutations.BeginTeaching = true
                                        _this.routerAc = 'XK'
                                        _this.$router.push('/home/XK')
                                        _this.loader.hide()
                                        $('.contentTop').css({'height': '10px'})
                                    }, 2000)
                                });
                            }
                            _this.notClick = function () {//重新定义取消按钮为继续上课
                                window.LessionID = res.data.data.LessionID
                                axios({
                                    method: "POST",
                                    url: 'api/ReTeachRecord/StartReTeachRecord' + '?sk=' + store.state.mutations.getToken,
                                    data: {
                                        TeacherID: store.state.mutations.USERINFO.ID,
                                        LessionID: LessionID,
                                        ClassID: store.state.mutations.enterClass
                                    }
                                }).then(function (res) {
                                    console.log(res.data)
                                    window.ExamTime = res.data.data

                                    _this.loader.show()

                                    setTimeout(function () {
                                        store.state.mutations.BeginTeaching = true
                                        _this.routerAc = 'XK'
                                        _this.$router.push('/home/XK')
                                        _this.loader.hide()
                                        $('.contentTop').css({'height': '10px'})
                                    }, 2000)
                                });
                            }
                        }, 100)

                    } else {
                        console.log('没有在上课 --- 已经正常结束')
                        axios({
                            method: "POST",
                            url: 'api/ReTeachRecord/StartReTeachRecord' + '?sk=' + store.state.mutations.getToken,
                            data: {
                                TeacherID: store.state.mutations.USERINFO.ID,
                                LessionID: LessionID,
                                ClassID: store.state.mutations.enterClass
                            }
                        }).then(function (res) {
                            console.log(res.data)
                            window.ExamTime = res.data.data

                            _this.loader.show()


                            setTimeout(function () {
                                store.state.mutations.BeginTeaching = true
                                _this.routerAc = 'XK'
                                _this.$router.push('/home/XK')
                                _this.loader.hide()
                                $('.contentTop').css({'height': '10px'})
                            }, 2000)
                        });

                    }
                })
//                setTimeout(function () {
//                    window.ExamTime = new Date()
//                    _this.routerAc = 'XK'
//                    _this.$router.push('/home/XK')
//                    _this.loader.hide()
//                    $('.contentTop').css({'height': '10px'})
//                }, 2000)


//                    store.state.mutations.BeginTeaching = true
//
//                }
            },
            XB(){
                this.routerAc = 'XB'
                this.$router.push('/home/XB')
            },
            XK(){
                if (store.getters.infoKESHI.length === 0) {
                    layer.msg('未选择章节或课时', {icon: 2});
                    this.routerAc = 'XB'
                    this.$router.push('/home/XB')
                } else {
                    this.routerAc = 'XK'
                    this.$router.push('/home/XK')
                }
            },
            DM(){
                var _this = this
                if (store.getters.enterClassID === '') {
                    layer.msg('请先选择班级', {icon: 2});
                    _this.routerAc = 'XB'
                    _this.$router.push('/home/XB')
                } else {
                    var loading = layer.load();

                    store.state.mutations.showStuIcon = false;
                    _this.$http.get(('api/userinfo/students?id=' + store.state.mutations.enterClassID + '&sk=' + store.state.mutations.getToken)).then(function (res) {

                        store.state.mutations.infoStudent = res.data.data

                        console.log(res.data.data)

                        for (var i = 0; i < store.state.mutations.infoStudent.length; i++) {
                            UserCode.push(store.state.mutations.infoStudent[i].UserCode)
                        }

                        //学生座位顺序
                        _this.$http.get(('api/SitPosSetting/GetSitPosSetting?classsID=' + store.state.mutations.enterClassID + '&sk=' + store.state.mutations.getToken)).then(function (res) {
                            console.log(res.data.data)
                            if (typeof(res.data.data) == 'undefined' || typeof(res.data.data.SequStduIds) == 'undefined') {
                                store.state.mutations.infoStuPos.ColNum = 8
                                layer.close(loading)
                                store.state.mutations.showStuIcon = true;
                                return
                            }
//                            if(res.data.data.SequStduIds){
//
//                            }
                            //座位序号数组
                            window.GetSitPosSetting = res.data.data.SequStduIds.split(',')
                            //保存座位序号信息
                            store.state.mutations.infoStuPos = res.data.data
                            //根据座位序号重新对学生信息数组排序
                            var SitPosSetting = []
                            for (var k = 0; k < GetSitPosSetting.length; k++) {
                                var PosSet = GetSitPosSetting[k]
                                for (var i = 0; i < store.state.mutations.infoStudent.length; i++) {
                                    if (store.state.mutations.infoStudent[i].ID == PosSet) {
                                        SitPosSetting.push(store.state.mutations.infoStudent[i])
                                    }
                                }
                            }
                            store.state.mutations.infoStudent = SitPosSetting
                            console.log(SitPosSetting)
                            store.state.mutations.showStuIcon = true;
                            layer.close(loading)
                        })
                    })
                    this.routerAc = 'DM'
                    this.$router.push('/home/DM')
                }
            },
            FZ(){
                if (store.getters.enterClassID === '') {
                    layer.msg('请先选择班级', {icon: 2});
                    this.routerAc = 'XB'
                    this.$router.push('/home/XB')
                } else {

                    var loading = layer.load();


                    //先获取学生信息
                    this.$http.get(('api/userinfo/students?id=' + store.state.mutations.enterClassID + '&sk=' + store.state.mutations.getToken)).then(function (res) {
                        store.state.mutations.infoStudent = res.data.data
                        console.log(store.state.mutations.infoStudent)
                        layer.close(loading)
                    })
//                        api/SitPosSetting/ GetSitPosSetting?classsID={classsID}

                    //再获取分组信息
                    this.$http.get(('api/GroupInfo/getGroupInfo?ClassId=' + store.state.mutations.enterClassID + '&sk=' + store.state.mutations.getToken)).then(function (res) {
                        store.state.mutations.infoStudentGrounp = res.data.data
                        console.log(res.data.data)
                    })

                    this.routerAc = 'FZ'
                    this.$router.push('/home/FZ')
                }
            },
            SK(){
                var _this = this
                if (store.getters.enterClassID === '' || store.getters.confirmZHANGJIEID === '') {
                    layer.msg('您还未选择班级或课程', {icon: 2});
//                    this.routerAc = 'XB'
//                    this.$router.push('/home/XB')

                } else {

                    this.showBigBtn = true;
                    this.notBtn = "取消"
                    this.sureBtn = "确定"
//                    this.notClick = function () {
//                        this.showBigBtn = false
//                    }
//                    this.sureClick = function () {
//
//                    }
                }
            },
            LogOut() {
                this.$router.push('/login')
                LogOut()
            }
        },
    }
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
    .funMenu {
        position: fixed;
        bottom: 2rem;
        right: 2rem;
        width: 94px;
        height: 470px;
        background: #33D795;
        border-radius: 6px;
        z-index: 99;
        ul {
            height: 450px;
            width: 100%;
            padding: 10px 0;
            li {
                height: 70px;
                width: 100%;
                padding: 3px 0;
                text-align: center;
                font-size: .8rem;
                a {
                    display: block;
                    width: 100%;
                    height: 100%;
                    .icon {
                        display: block;
                        width: 100%;
                        height: 50px;
                    }
                    span {
                        display: block;
                        height: 20px;
                        line-height: 20px;
                        color: rgb(184, 251, 228);
                    }
                }
            }
            .XB {
                .icon {
                    background: url("../../src/assets/images/class.png") no-repeat center;
                }
                .router-link-active {
                    .icon {
                        background: url("../../src/assets/images/class_1.png") no-repeat center;
                    }
                    span {
                        color: #fff;
                    }
                }
            }
            .XK {
                .icon {
                    background: url("../../src/assets/images/Course.png") no-repeat center;
                }
                .router-link-active {
                    .icon {
                        background: url("../../src/assets/images/Course_1.png") no-repeat center;
                    }
                    span {
                        color: #fff;
                    }
                }
            }
            .DM {
                .icon {
                    background: url("../../src/assets/images/rollCall.png") no-repeat center;
                }
                .router-link-active {
                    .icon {
                        background: url("../../src/assets/images/rollCall_1.png") no-repeat center;
                    }
                    span {
                        color: #fff;
                    }
                }
            }
            .FZ {
                .icon {
                    background: url("../../dist/images/rollCall.png") no-repeat center;
                }
                .router-link-active {
                    .icon {
                        background: url("../../dist/images/rollCall_1.png") no-repeat center;
                    }
                    span {
                        color: #fff;
                    }
                }
            }
            .SK {
                .icon {
                    background: url("../../dist/images/classStart_1.png") no-repeat center;
                }
                span {
                    color: #fff;
                }
            }
            .TC {
                .icon {
                    background: url("../../dist/images/SignOut_1.png") no-repeat center;
                }
                span {
                    color: #fff;
                }
            }
        }
    }
</style>